<template>
	<div>
		<input v-model="title" class="todosInp" type="text" placeholder="请输入你的任务名称,按回车确认" @keydown.enter="sendTodosData"/>
	</div>
</template>

<script>
	export default {
		name:'todos-header',
		data(){
			return {
				title:''
			}
		},
		// nanoid 了解
		methods:{
			sendTodosData(){
				console.log(123)
				this.addTodos({done:false,title:this.title,id:`${new Date().getTime()}`})
			}
		},
		props:['addTodos']
	}
</script>

<style scoped>
	.todosInp{
		width: 100%;
		padding: 5px 2px;
		box-sizing: border-box;
	}
</style>